
<template>
  <div class="con">
    <!--     
  <el-header style="padding:0;height: 56px;">
    <headbox ref="mychild"></headbox>
  </el-header>
      
    <el-aside  style="width:200px;background-color:#393D49;">
       <left></left>
    </el-aside>
        
    <el-main style="padding:0;">-->
    <!-- 放置内容区 -->
    <div class="contbox6_10" v-if="type==1">
      <!-- 机构列表 -->
      <p class="titlelist6_10">
        积分管理
        <span style="color: #999;">&nbsp;&nbsp;/&nbsp;&nbsp;</span>明细
        <!-- <el-button style="float: right;margin-right: 30px;" type="primary" @click="back">返回</el-button> -->
      </p>
      <div class="content">
      <div class="sousuojg6_11" style="background-color:none">
        <el-form ref="form" :model="form" label-width="100px">
          <el-form-item style="width:400px" label-width="150px" label="规则名称">
            <el-input v-model="form.pointsName" style="width:200px" :disabled="isEdit"></el-input>
          </el-form-item>
          <el-form-item style="width:500px" label-width="150px" label="活动有效期">
            <el-date-picker
                value-format="yyyy-MM-dd"
                type="date"
                placeholder="开始日期"
                v-model="form.startDate"
                :disabled="isEdit"
                @input="daterangeChange"
              ></el-date-picker>
              <div class="times">-</div>
              <el-date-picker
                value-format="yyyy-MM-dd"
                placeholder="结束日期"
                v-model="form.endDate"
                 @input="daterangeChanges"
                :disabled="isEdit"
              ></el-date-picker>
            <!-- <el-col :span="5">
              <el-date-picker
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="开始日期"
                v-model="form.startDate"
                style="width: 100%;"
                :disabled="isEdit"
              ></el-date-picker>
            </el-col>
            <el-col class="line" :span="1" style="text-align: center;">-</el-col>
            <el-col :span="5">
              <el-date-picker
                value-format="yyyy-MM-dd"
                placeholder="结束日期"
                v-model="form.endDate"
                style="width: 100%;"
                :disabled="isEdit"
              ></el-date-picker>
            </el-col> -->
          </el-form-item>

          <!-- <div style="width: 100%;float: left;border-bottom: 2px solid #ddd;margin:20px 0 30px 0;"></div> -->
          <p class="jibenInfo">
            积分规则
           </p>
           <el-form-item label="订单实付金额每满" label-width="150px" style="width:100%">
               <el-input v-model="form.pointsRuleAmount" 
                :disabled="isEdit"></el-input> 元,
              &nbsp;&nbsp;获得
              <el-input v-model="form.pointsRuleNum" :disabled="isEdit"></el-input
              > 积分;&nbsp;&nbsp;单笔订单最高获得               
              <el-input v-model="form.pointsSingleNum" :disabled="isEdit"></el-input               
              > 积分。
            </el-form-item>

            <el-form-item label="人群限制" label-width="150px" style="width:100%" >
             <el-radio-group v-model="form.userType" :disabled="isEdit">
               <el-radio label="0">所有</el-radio>
               <el-radio label="1">权益</el-radio>
             </el-radio-group>
           </el-form-item>
           <el-form-item label="规则描述" label-width="150px" style="width:60%">
             <el-input type="textarea" v-model="form.ruleDesc" :disabled="isEdit"></el-input>
           </el-form-item>
           <el-col  style="padding-left:40%" label-width="0px">
             <el-button type="primary" v-if="isEdits!='1'"   @click="onSubmit">完成</el-button>
             <el-button type="primary" v-if="isEdits=='1'"  @click="onSubmits">完成</el-button>
             <el-button @click="cancal">取消</el-button>
           </el-col>
        </el-form>
      </div>
    </div>
</div>
    <!--  </el-main>
      <el-footer style="padding:0;">
        <footerbox></footerbox>
      </el-footer>
    </el-container>
  </el-container>
    </el-container>-->
  </div>
</template>

<script>
export default {
  name: "route",
  data() {
    return {
      typebox: 0,
      type: 1,
      msg: [],
      newType: "",
      form: {
        oemUid:
          localStorage.getItem("jurisdiction") != 2
            ? localStorage.getItem("uid")
            : "", //OEMid
        pointsName: "",
        startDate: "",
        endDate: "",
        ruleDesc: "",
        userType: "",
        pointsRuleAmount: "",
        pointsRuleNum: "",
        pointsSingleNum: "",
        id: "",
      },
      tableData: [],
      multipleSelection: [],
      urltype: this.GLOBAL.httpurl,
      isEdit: "",
      isEdits: "",
    };
  },
  mounted: function () {
    window.scrollTo(0, 0);
    var _this = this;
    _this.typebox = localStorage.getItem("jurisdiction");
    _this.form.id = sessionStorage.getItem("jifenId"); //查看详情传id
    _this.detailfunc();
    // console.log(_this.form.id);
    _this.isEdit = localStorage.getItem("isEdit"); //当前页面是否可编辑 0不可编辑  1可编辑
    if (_this.isEdit == 0) {
      _this.isEdits=_this.isEdit
      _this.isEdit = true;
    } else {
       _this.isEdits=_this.isEdit
      _this.isEdit = false;
    }
    if (
      sessionStorage.getItem("jifenId") == "" ||
      sessionStorage.getItem("jifenId") == undefined
    ) {
      _this.form = {
        oemUid:
          localStorage.getItem("jurisdiction") != 2
            ? localStorage.getItem("uid")
            : "", //OEMid
        pointsName: "",
        startDate: "",
        endDate: "",
        startTime: "",
        endTime: "",
        ruleDesc: "",
        userType: "",
        pointsRuleAmount: "",
        pointsRuleNum: "",
        pointsSingleNum: "",
        id: "",
      };
    }
  },
  //watch:{// 监听type的变化情况
  // type: function(newVal, oldVal){//type是data的return返回对象中的数组变量，newVal是属性变化后的值，oldVal是属性变化前的值
  // if(newVal==1){
  //  this.shuju();

  // }
  // }
  //},

  methods: {
    numDelete(n, s) {
      var _this = this;

      _this
        .axios({
          //axios请求
          method: "post",
          url: _this.urltype + "/api/office/changeStatus",
          data: {
            uid: n,
            status: s,
          },
        })
        .then(function (d) {
          if (d.data.code == "0000") {
            layer.open({
              content: d.data.msg,
              skin: "msg",
              time:  2, //1秒后自动关闭
            });
            _this.shuju();
          } else {
            layer.open({
              content: d.data.msg,
              skin: "msg",
              time:  2, //1秒后自动关闭
            });
          }
        })
        .catch(function (error) {
          //axios请求失败回调
          console.log(error);
        });
    },
    onSubmit() {
      var _this = this;
      _this
        .axios({
          //axios请求
          method: "post",
          url: _this.urltype + "/api/points/editPointsRuleDetail",
          data: _this.form,
        })
        .then(function (d) {
          if (d.data.code == "0000") {
            // _this.form = d.data;
            // _this.$router.push({ name: "integralmanage" });
            _this.$parent.type=1
          } else {
            layer.open({
              content: d.data.msg,
              skin: "msg",
              time:  2, //1秒后自动关闭
            });
          }
        })
        .catch(function (error) {
          //axios请求失败回调
          console.log(error);
        });
     
    },
    onSubmits(){
      var _this = this;
      _this
        .axios({
          //axios请求
          method: "post",
          url: _this.urltype + "/api/points/addPointsRule",
          data: _this.form,
        })
        .then(function (d) {
          if (d.data.code == "0000") {
            // _this.form = d.data;
            // _this.$router.push({ name: "integralmanage" });
            _this.$parent.type=1
          } else {
            layer.open({
              content: d.data.msg,
              skin: "msg",
              time:  2, //1秒后自动关闭
            });
          }
        })
        .catch(function (error) {
          //axios请求失败回调
          console.log(error);
        });
    },
    cancal(){
      this.$parent.type=1
    },
    // 详情
    detailfunc() {
      var _this = this;
      _this
        .axios({
          //axios请求
          method: "post",
          url: _this.urltype + "/api/points/getPointsRuleDetail",
          data: _this.form,
        })
        .then(function (d) {
          if (d.data.code == "0000") {
            console.log(d.data.data);
            d.data.data.startTime = d.data.data.startTime.split(" ")[0];
            d.data.data.endTime = d.data.data.endTime.split(" ")[0];
            _this.form = d.data.data;
            _this.form.startDate = _this.form.startTime;
            _this.form.endDate = _this.form.endTime;
          } else {
            layer.open({
              content: d.data.msg,
              skin: "msg",
              time:  2, //1秒后自动关闭
            });
          }
        })
        .catch(function (error) {
          //axios请求失败回调
          console.log(error);
        });
    },

    // 创建
    shuju() {
      var _this = this;
      _this
        .axios({
          //axios请求
          method: "post",
          url: _this.urltype + "/api/points/addPointsRule",
          data: _this.form,
        })
        .then(function (d) {
          if (d.data.code == "0000") {
            // _this.form = d.data;
            _this.$router.push({ name: "integralmanage" });
          } else {
            layer.open({
              content: d.data.msg,
              skin: "msg",
              time:  2, //1秒后自动关闭
            });
          }
        })
        .catch(function (error) {
          //axios请求失败回调
          console.log(error);
        });
    },
    daterangeChange(e){
      console.log(e)
      let _this = this;
       _this.$nextTick(() => {
        _this.$set(_this.form, "timers", e);
        _this.$forceUpdate();
      });
      this.form.startDate=e
    },
    daterangeChanges(e){
      console.log(e)
      let _this = this;
       _this.$nextTick(() => {
        _this.$set(_this.form, "timers", e);
        _this.$forceUpdate();
      });
      this.form.endDate=e
    },
    handleSizeChange(val) {
      this.form.number = val; //动态改变
      this.shuju();
    },
    handleCurrentChange(val) {
      /* alert(`当前页: ${val}`);*/

      this.form.page = val; //动态改变
      this.shuju();
    },
    toggleSelection(rows) {
      if (rows) {
        rows.forEach((row) => {
          this.$refs.multipleTable.toggleRowSelection(row);
        });
      } else {
        this.$refs.multipleTable.clearSelection();
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    showdou() {
      this.$refs.mychild.parentHandleclick();
    },
    //返回按钮
    back() {
       var _this = this;
      _this.$router.push({ name: "integralmanage" });
    },
  },
};
</script>

<style scoped>
.con{
  position: relative;
}
.content{
  padding: 20px 0
}
/* 单独样式 */
.contbox6_10 {
  width: 100%;
  /* margin-left: 2%; */
  /*  height: 87.5vh; */
  overflow-x: auto;
  box-sizing: border-box;
  float: left;
}
.titlelist6_10 {
  width: 100%;
  float: left;
  font-size: 16px;
  color: #222;
  margin-top: 40px;
}
.sousuojg6_10 {
  float: left;
  font-size: 16px;
  color: #222;
  box-sizing: border-box;
  border-radius: 5px;
}
 .titlelist6_1 {
   width: 100%;
   float: left;
   font-size: 16px;
   color: #222;
   /* margin-top: 40px; */
 }
 .times{
   width: 20px;
   display: inline-block;
   text-align: center
 }
 .el-textarea__inner{
   width: 78%;
   min-height: 140px !important;
 }
 .el-date-editor {
     width: 136px !important;
 }
 .jibenInfo {
  width: calc(100% - 40px);
  margin: 20px;
  height: 40px;
  line-height: 40px;
  padding-left: 20px;
  background: #f9fafc;
  float: left;
}
</style>

